import { createVNode, render } from 'vue';
import ConfirmDialog from '@/components/confirm-dialog/index.vue';

/**
 * 函数式调用确认弹窗
 * @param {Object} options 配置项
 * @param {String} options.type 类型：info, success, warn, error
 * @param {String} options.title 标题
 * @param {String} options.content 内容
 * @param {String} options.cancelText 取消按钮文本
 * @param {String} options.confirmText 确认按钮文本
 * @param {Function} options.confirm 确认回调
 * @param {Function} options.cancel 取消回调
 * @returns {Promise} 返回Promise对象
 */
export function showConfirm(options = {}) {
  return new Promise((resolve, reject) => {
    // H5环境使用Vue的createVNode方式
    if (process.env.UNI_PLATFORM === 'h5') {
      // 创建一个div作为容器
      const container = document.createElement('div');
      document.body.appendChild(container);
      
      // 创建确认回调
      const confirmCallback = () => {
        // 移除DOM
        render(null, container);
        container.remove();
        // 返回结果
        resolve();
        if (options.confirm) {
          options.confirm();
        }
      };
      
      // 创建取消回调
      const cancelCallback = () => {
        // 移除DOM
        render(null, container);
        container.remove();
        // 返回结果
        reject();
        if (options.cancel) {
          options.cancel();
        }
      };
      
      // 创建虚拟节点
      const vnode = createVNode(ConfirmDialog, {
        type: options.type || 'warn',
        title: options.title || '提示',
        content: options.content || '',
        cancelText: options.cancelText || '取消',
        confirmText: options.confirmText || '确定',
        confirmCallback,
        cancelCallback,
        onConfirm: confirmCallback,
        onClose: cancelCallback
      });
      
      // 渲染到容器
      render(vnode, container);
      
      // 打开弹窗
      setTimeout(() => {
        vnode.component.exposed.open();
      }, 10);
    } else {
      uni.showModal({
        title: options.title || '提示',
        content: options.content || '',
        cancelText: options.cancelText || '取消',
        confirmText: options.confirmText || '确定',
        success: (res) => {
          if (res.confirm) {
            resolve();
            if (options.confirm) {
              options.confirm();
            }
          } else {
            reject();
            if (options.cancel) {
              options.cancel();
            }
          }
        }
      });
    }
  });
}

// 封装预设类型的确认弹窗
export function confirm(content, title = '提示', options = {}) {
  return showConfirm({
    type: 'warn',
    title,
    content,
    ...options
  });
}

export function info(content, title = '提示', options = {}) {
  return showConfirm({
    type: 'info',
    title,
    content,
    ...options
  });
}

export function success(content, title = '成功', options = {}) {
  return showConfirm({
    type: 'success',
    title,
    content,
    ...options
  });
}

export function error(content, title = '错误', options = {}) {
  return showConfirm({
    type: 'error',
    title,
    content,
    ...options
  });
}

export default {
  showConfirm,
  confirm,
  info,
  success,
  error
};